﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Faxingtie.aspx.cs" Inherits="MiaoWeiProject.tanlu.Faxingtie" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <style type="text/css">
        * {
            padding: 0px;
            margin: 0px;
            font-size: 12px;
        }

        li {
            list-style: none;
        }

        a {
            text-decoration: none;
        }
        /*头部样式*/
        #heard {
            width: 100%;
            height: 70px;
            /*background-color:#e7e2eb;*/
            background: url('/images/nav-bg.png') repeat-x left top;
            display: flex;
        }

        #heard_conet {
            height: 50px;
            margin: 10px auto;
            width: 75%;
            /*border:1px solid red;*/
            display: flex;
            justify-content: space-between;
        }

        #conter_left {
            width: 275px;
            height: 50px;
            /*border:1px solid red;*/
            background: url('/images/nav-logo-2019-0826.png') no-repeat left center;
        }

        #conter_zhong {
            width: 60%;
            height: 50px;
            /*border:1px solid red;*/
        }

            #conter_zhong ul {
                display: flex;
                justify-content: space-between;
                overflow: hidden;
            }

                #conter_zhong ul li {
                    /*width:18%;*/
                    /*border:1px solid green;*/
                    text-align: center;
                    height: 50px;
                    line-height: 50px;
                }

                    #conter_zhong ul li a {
                        padding: 7px 27px;
                        /*border:1px solid pink;*/
                        color: #666;
                        font-size: 1.2em;
                        border-radius: 18px;
                    }

                    #conter_zhong ul li i.nav-new {
                        display: inline-block;
                        width: 39px;
                        height: 20px;
                        background: url('/images/nav-new.png') no-repeat left top;
                        vertical-align: middle;
                        margin-left: 4px;
                    }
        /*悬浮导航样式*/
        /*#conter_zhong ul li a:*/ .hover {
            color: #f70;
            background-color: #e0dce4;
            box-shadow: 2px 2px 1px #c5c0cc inset;
        }

        #conter_right {
            width: 8%;
            height: 50px;
            /*border:1px solid red;*/
        }

            #conter_right ul {
                height: 50px;
                line-height: 50px;
                display: flex;
                justify-content: space-between;
                overflow: hidden;
            }

                #conter_right ul li {
                    text-align: center;
                }

                    #conter_right ul li a {
                        font-size: 1.1em;
                        color: #666;
                    }

                        #conter_right ul li a:hover {
                            color: #f70;
                        }
        /*点击导航样式*/
        .yangshi {
            color: #fff;
            background-color: #e75c77;
            box-shadow: 2px 2px 1px #c42f4c inset;
        }
        /*中间样式*/
        #zhongjian {
            height: 100%;
            width: 100%;
            border: 1px solid red;
            background-color: #f0eff0;
        }
        /*头部搜索样式*/
        #zhongjian_Sousuo {
            width: 100%;
            height: 217px;
            border: 1px solid green;
            background-image: url(../tanlu/tanluimages/搜索图片.jpg);
            background-repeat: no-repeat;
            background-size: 100% 100%;
            position: relative;
        }

            #zhongjian_Sousuo a {
                color: #ffffff;
                font-size: 14px;
                position: absolute;
                left: 13%;
                top: 15%;
            }

                #zhongjian_Sousuo a.dinwei {
                    color: #ffffff;
                    font-size: 14px;
                    position: absolute;
                    left: 15.5%;
                    top: 15%;
                }

                #zhongjian_Sousuo a.dinwei2 {
                    color: #ffffff;
                    font-size: 14px;
                    position: absolute;
                    left: 17.4%;
                    top: 15%;
                }

        #shurukuan {
            border: 1px solid #fff;
            background-color: #332e31;
            width: 400px;
            height: 45px;
            border-radius: 40px;
            font-size: 17px;
            color: #fff;
        }

        #go {
            height: 45px;
            width: 45px;
            background-color: #fff;
            color: #302b2f;
            font-size: 17px;
            border-radius: 23px;
            border: 1px solid #fff;
            margin-left: 15px;
        }

        #soushufanwei {
            width: 480px;
            height: 50px;
            border: 1px solid #fff;
            position: absolute;
            left: 35%;
            top: 53%;
        }
        /*类型*/
        #leixin {
            width: 100%;
            background-color: #fff;
            border: 1px solid #5486cb;
            height: 80px;
            position: relative;
        }

        #leixin_ul {
            display: flex;
            position: absolute;
            left: 13%;
            top: 35%;
        }

            #leixin_ul li a {
                font-size: 17px;
                color: #666;
                margin-right: 50px;
            }

        #faxingtie {
            position: absolute;
            right: 13%;
            top: 25%;
        }
        /*最新与热帖*/
        #zuixinyuretie {
            width: 75%;
            border: 1px solid #f70;
            height: 50px;
            margin: 0 auto;
            line-height: 50px;
        }

        #leixin_ul2 {
            display: flex;
            margin-top: 10px;
        }

            #leixin_ul2 li {
                width: 90px;
                height: 25px;
                /*border:1px solid #f70;*/
                line-height: 25px;
                text-align: center;
                margin-left: 10px;
                border-radius: 25px;
            }

                #leixin_ul2 li:hover {
                    background-color: #e75c77;
                }

                #leixin_ul2 li a:hover {
                    color: #fff;
                }

                #leixin_ul2 li a {
                    font-size: 14px;
                    color: #666;
                }



        /*内容样式*/
        #neiro {
            width: 75%;
            height: 1000px;
            border: 1px solid #c42f4c;
            margin: 0px auto;
        }

        #han1 {
            width: 100%;
            height: 120px;
            border: 1px solid #e75c77;
            display: flex;
        }

        .fatieleixin {
            height: 120px;
            line-height: 120px;
            width: 110px;
            border: 1px solid #332e31;
            color: #8e8e8e;
            font-size: 17px;
           
        }

        .leixin {
            height: 49px;
            line-height: 49px;
            margin-top: 35px;
            width: 121px;
            border: 1px solid #e75c77;
            background-color: #f0f0f0;
            text-align: center;
            margin-right: 15px;
        }

            .leixin a {
                color: #666;
                font-size: 17px;
            }

        .yangshio {
            background-color: #e75c77;
        }

            .yangshio a {
                color: #fff;
            }
            #han2 {
            width: 100%;
            height: 120px;
            border: 1px solid #e75c77;
            display: flex;
        }
            #shurokua{
                width:100%;
                height:100%;
                display:flex;
                border:1px solid #e75c77;
            }
            .kugao{
                width:98.5%;
                height:117px;
                font-size:17px;
                color:#585858;
            }
            #zhi{
                margin-top:30px;
                font-size:16px;
                color:#929292;
            }
            #zhi span{
                font-weight:bold;
                color:red;
                font-size:18px;
            }
            div textarea{
                float:right;
            }
            #han3 {
            width: 100%;
            height: 120px;
            border: 1px solid #e75c77;
            display: flex;
        }
        /*尾部样式*/
        #weibu {
            height: 144px;
            width: 100%;
            border: 1px solid green;
            display: flex;
            background: url('/images/footer-bg.jpg') repeat-x left top;
        }

        #weibu_zhong {
            width: 75%;
            height: 80px;
            margin: 30px auto;
            justify-content: space-between;
            /*border:1px solid pink;*/
            display: flex;
        }

        #weibu_left {
            height: 100%;
            width: 25%;
            /*border:1px solid black;*/
            border-right: 2px solid #b7b3c1;
        }

        #weibu_right {
            height: 100%;
            width: 65%;
            /*border:1px solid blue;*/
        }

        #weibu_right_top {
            height: 50%;
            width: 100%;
            /*border:1px solid red;*/
        }

        #weibu_right_down {
            height: 50%;
            width: 100%;
            /*border:1px solid black;*/
        }

        #weibu_right_top ul {
            display: flex;
            justify-content: space-between;
            overflow: hidden;
        }

            #weibu_right_top ul li {
                height: 35px;
                line-height: 35px;
            }

                #weibu_right_top ul li a {
                    color: #666;
                    font-size: 1.1em;
                }

                    #weibu_right_top ul li a:hover {
                        color: #f70;
                    }

                #weibu_right_top ul li.link-line {
                    color: #666;
                    padding: 0 16px;
                }

        #weibu_right_down p {
            font-size: 1.2em;
            color: #6f7b91;
            height: 35px;
            line-height: 35px;
        }
    </style>
    <script src="../js/jquery-3.3.1.min.js"></script>
    <script type="text/javascript">
        $(function () {

            //页面加载事件
            function baogo() {
                $.ajax({
                    type: "post",
                    url: "neiro.ashx",
                    dataType: "json",
                    success: function (result) {
                        //返回成功
                        //遍历JSON数组
                        $.each(result, function (i, item) {
                            var biaoti = item.FaTieTypeTitle;
                            console.log(biaoti);
                            var shijian = item.FaTieTime;
                            new Date(parseInt(shijian.substr(6, 13))).toLocaleString();
                            console.log(shijian);
                            var dianjilu = item.DianJiRate;
                            console.log(dianjilu);
                            var yonghuxinmi = item.UserName;
                            console.log(yonghuxinmi);
                            //alert("<li class='huahan'><p class='yido4'>" + biaoti + "</p><p class='yido1'>" + dianjilu + "</p><p class='yido2'>" + shijian + "</p><p class='yido3'>" + yonghuxinmi + "</p> </li>");
                            $("#liebiao").children("ul").append("<li class='huahan'><p class='yido4'>" + biaoti + "</p><p class='yido1'>" + yonghuxinmi + "</p><p class='yido2'>" + new Date(parseInt(shijian.substr(6, 13))).toLocaleString() + "</p><p class='yido3'>" + dianjilu + "</p> </li>");

                        });
                    }
                });
            };
            baogo();

            $(".li").hover(function () {
                $(this).addClass("hover");
                $(this).css({ "color": " #f70" });
                //$(this).parent().siblings().children().removeClass("hover");
            }, function () {
                $(this).removeClass("hover");
                $(this).css({ "color": "#666" });
                //$(this).parent().siblings().children().removeClass("hover");
            }
            );
            $(".li").click(function () {
                $(this).addClass("yangshi");
                $(this).css({ "color": "white" });
                $(this).parent().siblings().children().removeClass("yangshi");
            });
            //返回顶部
            $(document).ready(function () {
                //首先将#btn隐藏
                $("#btn").hide();
                //当滚动条的位置处于距顶部50像素以下时，跳转链接出现，否则消失
                $(function () {
                    $(window).scroll(function () {
                        if ($(window).scrollTop() > 50) {
                            $("#btn").fadeIn(200);
                        } else {
                            $("#btn").fadeOut(200);
                        }
                    });
                    //当点击跳转链接后，回到页面顶部位置
                    $("#btn").click(function () {
                        $('body,html').animate({
                            scrollTop: 0
                        },
                        500);
                        return false;
                    });
                });
            });
            //技术交流
            $("#leixin_ul li:eq(0)").click(function () {
                $("#liebiao").children("ul").html("");
                $.ajax({
                    type: "post",
                    url: "neiro1.ashx",
                    dataType: "json",
                    success: function (result) {
                        //返回成功
                        //遍历JSON数组
                        $.each(result, function (i, item) {
                            var biaoti = item.FaTieTypeTitle;
                            var shijian = item.FaTieTime;
                            new Date(parseInt(shijian.substr(6, 13))).toLocaleString();
                            var dianjilu = item.DianJiRate;
                            var yonghuxinmi = item.UserName;
                            //alert("<li class='huahan'><p class='yido4'>" + biaoti + "</p><p class='yido1'>" + dianjilu + "</p><p class='yido2'>" + shijian + "</p><p class='yido3'>" + yonghuxinmi + "</p> </li>");
                            $("#liebiao").children("ul").append("<li class='huahan'><p class='yido4'>" + biaoti + "</p><p class='yido1'>" + yonghuxinmi + "</p><p class='yido2'>" + new Date(parseInt(shijian.substr(6, 13))).toLocaleString() + "</p><p class='yido3'>" + dianjilu + "</p> </li>");

                        });
                    }
                });
            });
            //作品分享
            $("#leixin_ul li:eq(1)").click(function () {
                $("#liebiao").children("ul").html("");
                $.ajax({
                    type: "post",
                    url: "neiro2.ashx",
                    dataType: "json",
                    success: function (result) {
                        //返回成功
                        //遍历JSON数组
                        $.each(result, function (i, item) {
                            var biaoti = item.FaTieTypeTitle;
                            var shijian = item.FaTieTime;
                            new Date(parseInt(shijian.substr(6, 13))).toLocaleString();
                            var dianjilu = item.DianJiRate;
                            var yonghuxinmi = item.UserName;
                            //alert("<li class='huahan'><p class='yido4'>" + biaoti + "</p><p class='yido1'>" + dianjilu + "</p><p class='yido2'>" + shijian + "</p><p class='yido3'>" + yonghuxinmi + "</p> </li>");
                            $("#liebiao").children("ul").append("<li class='huahan'><p class='yido4'>" + biaoti + "</p><p class='yido1'>" + yonghuxinmi + "</p><p class='yido2'>" + new Date(parseInt(shijian.substr(6, 13))).toLocaleString() + "</p><p class='yido3'>" + dianjilu + "</p> </li>");

                        });
                    }
                });
            });
            //官方发布
            $("#leixin_ul li:eq(2)").click(function () {
                $("#liebiao").children("ul").html("");
                $.ajax({
                    type: "post",
                    url: "neiro3.ashx",
                    dataType: "json",
                    success: function (result) {
                        //返回成功
                        //遍历JSON数组
                        $.each(result, function (i, item) {
                            var biaoti = item.FaTieTypeTitle;
                            var shijian = item.FaTieTime;
                            new Date(parseInt(shijian.substr(6, 13))).toLocaleString();
                            var dianjilu = item.DianJiRate;
                            var yonghuxinmi = item.UserName;
                            //alert("<li class='huahan'><p class='yido4'>" + biaoti + "</p><p class='yido1'>" + dianjilu + "</p><p class='yido2'>" + shijian + "</p><p class='yido3'>" + yonghuxinmi + "</p> </li>");
                            $("#liebiao").children("ul").append("<li class='huahan'><p class='yido4'>" + biaoti + "</p><p class='yido1'>" + yonghuxinmi + "</p><p class='yido2'>" + new Date(parseInt(shijian.substr(6, 13))).toLocaleString() + "</p><p class='yido3'>" + dianjilu + "</p> </li>");

                        });
                    }
                });
            });
            //妙味图书
            $("#leixin_ul li:eq(3)").click(function () {
                $("#liebiao").children("ul").html("");
                $.ajax({
                    type: "post",
                    url: "neiro4.ashx",
                    dataType: "json",
                    success: function (result) {
                        //返回成功
                        //遍历JSON数组
                        $.each(result, function (i, item) {
                            var biaoti = item.FaTieTypeTitle;
                            var shijian = item.FaTieTime;
                            new Date(parseInt(shijian.substr(6, 13))).toLocaleString();
                            var dianjilu = item.DianJiRate;
                            var yonghuxinmi = item.UserName;
                            //alert("<li class='huahan'><p class='yido4'>" + biaoti + "</p><p class='yido1'>" + dianjilu + "</p><p class='yido2'>" + shijian + "</p><p class='yido3'>" + yonghuxinmi + "</p> </li>");
                            $("#liebiao").children("ul").append("<li class='huahan'><p class='yido4'>" + biaoti + "</p><p class='yido1'>" + yonghuxinmi + "</p><p class='yido2'>" + new Date(parseInt(shijian.substr(6, 13))).toLocaleString() + "</p><p class='yido3'>" + dianjilu + "</p> </li>");

                        });
                    }
                });
            });
            //搜索按钮
            $("input#go").click(function () {
                //alert("1");
                var zhi = $("#shurukuan").val();
                //alert($("#shurukuan").val());
                $("#liebiao").children("ul").html("");
                $.ajax({
                    type: "post",
                    url: "sosuannio.ashx?cid=" + zhi,
                    dataType: "json",
                    success: function (result) {
                        //返回成功
                        //遍历JSON数组
                        $.each(result, function (i, item) {
                            var biaoti = item.FaTieTypeTitle;
                            var shijian = item.FaTieTime;
                            new Date(parseInt(shijian.substr(6, 13))).toLocaleString();
                            var dianjilu = item.DianJiRate;
                            var yonghuxinmi = item.UserName;
                            //alert("<li class='huahan'><p class='yido4'>" + biaoti + "</p><p class='yido1'>" + dianjilu + "</p><p class='yido2'>" + shijian + "</p><p class='yido3'>" + yonghuxinmi + "</p> </li>");
                            $("#liebiao").children("ul").append("<li class='huahan'><p class='yido4'>" + biaoti + "</p><p class='yido1'>" + yonghuxinmi + "</p><p class='yido2'>" + new Date(parseInt(shijian.substr(6, 13))).toLocaleString() + "</p><p class='yido3'>" + dianjilu + "</p> </li>");

                        });
                    }
                });
            });
            //发帖类型分类
            $(".leixin").click(function () {

                $(this).addClass("yangshio");
                $(this).addClass("yangshio a");
                $(this).siblings().removeClass("yangshio");
            });
            $("#accepted_answer").keyup(function () {
                var len = $(this).val().length;
                if (len > 149) {
                    $(this).val($(this).val().substring(0, 150));
                    $("#word").text(0);
                }
                var num = 150 - len;

                if (num < 0) {
                    $("#word").text(0);
                } else {
                    $("#word").text(num);
                }
            });

        });
    </script>
    <script lang="javascript" type="text/javascript"> function countNum() { var count = document.getElementById("txtText").value.length; document.getElementById("lblCount").value = count; } </script>
</head>
<body>
    <form id="form1" runat="server">
        <div aria-hidden="False">
            <%--  头部--%>
            <div id="heard">
                <div id="heard_conet">
                    <div id="conter_left"></div>
                    <div id="conter_zhong">
                        <ul>
                            <li><a href="#" class="li">首页</a></li>
                            <li><a href="#" class="li">课程</a></li>
                            <li><a href="#" class="li">视频学习</a></li>
                            <li><a href="#" class="li">尊享视频<i class="nav-new"></i></a></li>
                            <li><a href="#" class="li">社区</a></li>
                        </ul>
                    </div>
                    <div id="conter_right">
                        <ul>
                            <li><a href="#">登录</a></li>
                            <li>|</li>
                            <li><a href="#">注册</a></li>
                        </ul>
                    </div>
                </div>
            </div>
            <%--中间内容--%>
            <div id="zhongjian">
                <%--头部搜索样式--%>
                <div id="zhongjian_Sousuo">
                    <p><a href="#">首页></a><a class="dinwei" href="SheQuSheYe.aspx">社区</a><a class="dinwei2" href="#">>提问</a></p>
                    <div id="soushufanwei">
                        <p>
                            <asp:TextBox ID="shurukuan" runat="server" placeholder="请输入关键字"></asp:TextBox><input type="button" id="go" value="GO" /></p>
                    </div>
                </div>
            </div>
            <%--内容--%>
            <div id="neiro">
                <div id="han1">
                    <div class="fatieleixin">
                        发帖类型
                    </div>
                    <div class="leixin">
                        <a href="#" class="bianse">技术交流</a>
                    </div>
                    <div class="leixin">
                        <a href="#" class="bianse">作品分享</a>
                    </div>
                    <div class="leixin">
                        <a href="#" class="bianse">妙味图书</a>
                    </div>
                </div>
                <div id="han2">
                    <div class="fatieleixin">
                        标题
                    </div>
                    <div id="shurokua">
                        <div><textarea  style="resize:none;" class="kugao" cols="150" id="accepted_answer"></textarea></div>
                        <div id="zhi">您还可以输入：<span id="word">150</span>个字！</div>
                    </div>
                </div>
                <div id="han3">
                    <div class="fatieleixin">
                        标题
                    </div>

                </div>
            </div>

            <%--  尾部内容--%>
            <div id="weibu">
                <div id="weibu_zhong">
                    <div id="weibu_left">
                        <img src="../images/weibumiaowei.jpg" />
                    </div>
                    <div id="weibu_right">
                        <div id="weibu_right_top">
                            <ul>
                                <li><a href="#">首页</a></li>
                                <li class="link-line">|</li>
                                <li><a href="#">课程</a></li>
                                <li class="link-line">|</li>
                                <li><a href="#">视频学习</a></li>
                                <li class="link-line">|</li>
                                <li><a href="#">尊享视频</a></li>
                                <li class="link-line">|</li>
                                <li><a href="#">社区</a></li>
                                <li class="link-line">|</li>
                                <li><a href="#">关于我们</a></li>
                                <li class="link-line">|</li>
                                <li><a href="#">常见问题</a></li>

                            </ul>
                        </div>
                        <div id="weibu_right_down">
                            <p>京ICP备08102442号-1 2007-2019 MIAOV.COM 版权所有</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </form>
</body>
</html>
